<template>
	<view>
		<uni-table :loading="loading" :emptyText="'没有更多数据'" border stripe>
			<uni-tr>
				<uni-th align="center">提现金额</uni-th>
				<uni-th align="center">连续猜对歌曲数</uni-th>
				<uni-th align="center">看视频次数</uni-th>
				<uni-th align="center">连续签到天数</uni-th>
				<uni-th align="center">累计猜对歌曲数</uni-th>
				<uni-th width="204" align="center">操作</uni-th>
			</uni-tr>
			<uni-tr v-for="(item,index) in data" :key="index">
				<uni-td align="center"><span v-if="item.key=='index1'">新手</span><span
						v-if="item.key=='index2'">幸运</span>{{item.coin}}</uni-td>
				<uni-td align="center">{{item.liandui}}</uni-td>
				<uni-td align="center">{{item.video}}</uni-td>
				<uni-td align="center">{{item.qiandao}}</uni-td>
				<uni-td align="center">{{item.leijicaidui}}</uni-td>
				<uni-td align="center">
					<view class="uni-group">
						<button @click="confirmDelete(item)" class="uni-button" size="mini" type="warn">修改</button>
					</view>
				</uni-td>
			</uni-tr>
		</uni-table>

		<uni-popup ref="Popup" type="center">
			<view class="modal" style="width:450px; padding: 20px;">
				<view class="uni-container">
					<uni-forms ref="form" validateTrigger="bind">
						<uni-forms-item label="提现金额" name="title" labelWidth="100">
							<input class="uni-input-border" type="text" placeholder="提现金额" v-model="item.coin" />
						</uni-forms-item>
						<uni-forms-item label="连续猜对歌曲数" name="title" labelWidth="100">
							<input class="uni-input-border" type="text" placeholder="连续猜对歌曲数" v-model="item.liandui" />
						</uni-forms-item>

						<uni-forms-item label="看视频次数" name="title" labelWidth="100">
							<input class="uni-input-border" type="text" placeholder="看视频次数" v-model="item.video" />
						</uni-forms-item>

						<uni-forms-item label="连续签到天数" name="title" labelWidth="100">
							<input class="uni-input-border" type="text" placeholder="连续签到天数" v-model="item.qiandao" />
						</uni-forms-item>

						<uni-forms-item label="累计猜对歌曲数" name="title" labelWidth="100">
							<input class="uni-input-border" type="text" placeholder="累计猜对歌曲数"
								v-model="item.leijicaidui" />
						</uni-forms-item>

						<view class="uni-button-group pointer"><button class="uni-button uni-button-full" type="primary"
								:disabled="isLoading" @click="save">保存</button></view>
					</uni-forms>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				loading: false,
				data: [],
				item: {},
				isLoading: false,
			}
		},
		mounted() {
			this.loadData()
		},
		methods: {
			loadData() {
				this.isLoading = true
				uni.showLoading({
					title: '加载中'
				});
				uniCloud.callFunction({
					name: 'uni-admin',
					data: {
						action: "admin/gettixianrole",
						data: {}
					}
				}).then((res) => {
					console.log(res, "get--------------")
					this.data = res.result.data.list
					uni.hideLoading();
				}).catch((res) => {
					console.log(res)
				}).finally(err => {
					this.isLoading = false
					uni.hideLoading();
				})
			},
			confirmDelete(item) {
				this.item = item
				this.$refs.Popup.open()
				console.log(this.item)
			},
			save() {
				console.log("this.item: ",this.item);
				uni.showLoading({
					title: '保存中'
				});
				uniCloud.callFunction({
					name: 'uni-admin',
					data: {
						action: "admin/changetixianrole",
						data: this.item
					}
				}).then((res) => {
					console.log(res, "res--------------")
					this.isLoading = false
					uni.hideLoading();
					this.$refs.Popup.close()
					this.loadData()
				}).catch((res) => {
					console.log(res)
				}).finally(err => {
					this.isLoading = false
					uni.hideLoading();
				})
			}
		}
	}
</script>

<style>
	.modal {
		width: 100%;
		max-width: 980px;
		margin: 0 auto;
		background-color: #ffffff;
	}

	.modal-content {
		padding: 15px;
		height: 500px;
		box-sizing: border-box;
	}
</style>
